<template>
  <div class="container">
    <div class="addchildren" @click="addChildren">新增子女</div>
      <div v-for="(item, index) of childrenList" :key="index" @click="toDetail(item.studentId)" class="box">
        <div class="box-item">
          <div class="name"><span class="title">姓名：</span> {{ item.realName }}</div>
          <!-- <div class="name"><span class="title">身份证：</span> {{ item.cardId }}</div> -->
          <div class="name"><span class="title">手机号：</span> {{ item.mobilePhone }}</div>
          <div class="item-msg">
            <div class="author"><span class="title">学校：</span><span class="school">{{ item.schoolName }}</span></div>
            <div class="school">{{ item.schGrade }} </div>
            <div>{{ item.schClass }}</div>
          </div>
        </div>
      </div>
      <div class="addbtn" v-if='addFlag'>
        <van-button round block type="primary" native-type="submit" @click="gotoHome">
          进入首页
        </van-button>
      </div>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { onMounted } from 'vue'
import { showToast,showDialog } from 'vant';
import { getChildrenInfo } from '@/api/personalCenter';
const router = useRouter()
const parentId = JSON.parse(localStorage.getItem('parentId'));
const childrenList = ref([])

const getInfo = () => {
  const params = {
    parentId: parentId,
    currentPage: 1,
    pageSize: 20,
    sort: 'desc',
    sidx: '',
  }
  getChildrenInfo(params).then((res) => {
    if (res.code === 200) {
      childrenList.value = res.data.list
    } else {
      showToast(res.msg)
    }
  }).catch((err) => {
    console.log(err)
  })
}

const startTime = localStorage.getItem('fillStartTime')
console.log('startTime:',startTime);
const endTime = localStorage.getItem('fillEndTime')
console.log('endTime:',endTime);
const currentTime = new Date()
console.log('currentTime:',currentTime);
const toDetail = (id)=> {
  if(currentTime >= startTime && currentTime <= endTime){
     router.push({ path: '/editChildren',query: { id: id } })
  }else{
     showDialog({
        message: '当前不在可编辑时间区间内',
        theme: 'round-button',
        confirmButtonColor: '#1989fa'
      })
      return
  }
}

const addChildren=()=>{
  router.push('/addChildren')
}
const gotoHome=()=>{
  router.push('/Home')
}

const addFlag = ref(false)
if(router.currentRoute.value.query.status == 'homeinto'){
  addFlag.value = true
}else{
  addFlag.value = false
}

onMounted(() => {
  getInfo()
})




</script>

<style lang="scss" scoped>
.container{
  padding: 1rem;
  font-size: 1.4rem;
  background: #f9f9f9;
  position: relative;
}
.item-msg{
  display: flex;
  justify-content: flex-start;
  align-content: center;
}
.title{
  display: inline-block;
  width: 6rem;
}
.school{
  margin-right: 1rem;
}
.box-item{
  background: #fff;
  padding: 1rem;
  margin-bottom: 1rem;
}
.name{
  margin-bottom: 1rem;
}
.addchildren{
  color: #fff;
  background: rgb(22,155,213);
  width: 8rem;
  height: 3rem;
  line-height: 3rem;
  border-radius: 6px;
  text-align: center;
  margin-bottom: 1rem;
}
.addbtn{
  position: fixed;
  bottom: 1rem;
  width: 92%;
  left: 4%;
}

.van-button--danger{
  background: #1989fa!important;
}
</style>